<!--
  ~ Copyright (c) 2021 Zsj. All rights reserved.
  -->

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Login</title>
</head>
<body style="text-align: center">

<div>
    <h1>登录</h1>
    <h4 id="type" th:text="${type}"></h4>
    <form id="form" th:method="post" enctype="application/x-www-form-urlencoded">
        <div>
            <label>用户名</label>
            <input type="text" th:name="username">
        </div>
        <div>
            <label>密码</label>
            <input type="password" th:name="password">
        </div>
        <div>
            <label>验证码</label>
            <a id="ver" href="javascript:renew();" rel="external nofollow"></a>
            <input type="text" th:name="_v">
        </div>
        <input type="submit" th:type="submit">
    </form>
</div>

<script>
    const type = document.getElementById("type").innerText;
    localStorage.setItem('type', type);
    document.getElementById("form").setAttribute("action", "/api/" + type + "/login");

    function renew() {
        document.getElementById("ver").innerHTML = '';

        const child = document.createElement('img');
        child.height = 40;
        child.width = 100;
        child.src = "/api/" + type + "/code?t=" + Date.now();
        document.getElementById("ver").append(child)
    }

    renew();
</script>
</body>
</html>